Webmodules - JSConf.ar 2014

Transcript

1. WRITING A WEBMODULE JSCONF.AR 2014 @TOOTALLNATE
2. WEBMODULES!
3. Not this one
4. Not the Python library either
5. Definitely not this…
6. WEBMODULES! NPM MODULES DESIGNED FOR WEB BROWSER USAGE
7. HTTPS://GITHUB.COM/WEBMODULES
8. THERE’S SOME GUIDELINES… • Very small, focusing on a single task • Client-side bundling via browserify • Repository name matches npm package name • Add a README.md file • Add unit tests, with “cloud testing” enabled
9. SMALL, FOCUSED • Must export a Function: module.exports • Helps enforce the small and focused philosophy • Example: https://github.com/webmodules/node-contains
10. SMALL, FOCUSED • Cross-browser Polyfills • Remember to say focused though! • Example: https:// github.com/webmodules/ progress-event
11. SMALL, FOCUSED • If a module has an inverse function, implement it as a separate module / repository • Example: https://github.com/webmodules/wrap-range and https://github.com/webmodules/unwrap-range wrapRange(‘b’) → unwrapRange(‘b’) →
12. BROWSERIFY • Assume browserify will be used for client-side bundling • It’s possible that other bundlers like component or require.js might work in some cases, but untested
13. GITHUB == NPM • Make it easy for users to find the repository • Basically leaves us at the 2nd level namespace, since most of the good single-word names are taken in the npm registry at this point
14. ALWAYS ADD README.MD • Installation instructions • Usage example • API docs ( dox(1) ) • Travis-CI and Saucelabs build badges
15. CLOUD TESTING • Zuul • Use it to run Mocha unit tests in the browser • npm test command runs zuul • https://github.com/defunctzombie/zuul
16. CLOUD TESTING • Travis-CI • Use it to run SauceLabs browsers in the cloud • Set up GitHub commit hooks to test every commit • https://github.com/defunctzombie/zuul/wiki/Travis-ci
17. CLOUD TESTING • SauceLabs • Zuul is designed to integrate with Saucelabs • Somewhat annoying… you have to create a new SauceLabs account for every module created
18. CLOUD TESTING • In the end, hopefully you get all green passing tests!
19. ¡GRACIAS! https://github.com/webmodules